<html>
<head>
    <link rel="stylesheet" type="text/css" href="assets/js/jquery-toast/jquery-toast.css">
    <link rel="stylesheet" type="text/css" href="assets/css/index.css">
</head>
<body>
    <div id="waveform"></div>
    <div id="controls">
        <div class="btns">
            <button class="btn" id="btn-play">
                <i class="fa fa-play"></i>
            </button>
            <button class="btn" id="btn-pause">
                <i class="fa fa-pause"></i>
            </button>
        </div>
        <div id="minimap">
        </div>
    </div>
    <div id="tracks">
        <div class="track">
        </div>
    </div>
    <div id="track-highlight"></div>
    <div id="track-cursor"></div>
    <div id="splitter-cursor"></div>
    <script src='assets/js/jquery/jquery-3.2.1.min.js'></script>
    <script src='assets/js/jquery/jquery.mousewheel.min.js'></script>
    <script src="assets/js/jquery-toast/jquery-toast.js"></script>
    <script src="assets/js/wavesurfer/wavesurfer.min.js"></script>
    <script src="assets/js/wavesurfer/wavesurfer.minimap.min.js"></script>
    <script src='assets/js/index.js'></script>
</body>
</html>
